<template>
  <div class="bussiness">
    <div class="bussiness_top">
      <div
        style="
          display: flex;
          justify-content: space-between;
          border-top: 1px solid #f3f3f3;
          border-bottom: 1px solid #f3f3f3;
          padding: 20px;
        "
      >
        <div>
          <h3>{{shopMsg.name}}</h3>
          <p>
            <van-rate
              v-model="shopMsg.score"
              allow-half
              void-icon="star"
              gutter="5px"
              void-color="#eee"
              color="#ffd21e"
              :size="15"
              style="padding: 10px 20px 0px 0"
            />
            <span style="padding-right: 20px">(661)</span>
            <span>月售{{shopMsg.sellCount}}单</span>
          </p>
        </div>
        <div style="text-align: center; padding: 10px 0 0">
          <van-icon name="like" color="red" size="20px"/>
          <p style="padding-left: 4px">已收藏</p>
        </div>
      </div>
      <div
        style="
          border-bottom: 20px solid #f2f2f2;
          display: flex;
          justify-content: space-between;
          padding: 20px;
          text-align: center;
        "
      >
        <div>
          <p style="color: #aaa">起送价</p>
          <p><span style="font-size: 24px; line-height: 40px">{{shopMsg.minPrice}}</span> 元</p>
        </div>
        <div>
          <p style="color: #aaa">商家配送</p>
          <p><span style="font-size: 24px; line-height: 40px">{{shopMsg.deliveryPrice}}</span> 元</p>
        </div>
        <div>
          <p style="color: #aaa">平均配送时间</p>
          <p><span style="font-size: 24px; line-height: 40px">{{shopMsg.deliveryTime}}</span> 分钟</p>
        </div>
      </div>
    </div>

    <div class="bussiness_buttom">
      <h3>活动与公告</h3>
      <p
        style="
          border-bottom: 1px solid #ccc;
          color: red;
          padding-bottom: 20px;
          margin-bottom: 20px;
          
        "
      >
        {{shopMsg.bulletin}}
      </p>
      <p style="display: flex;margin-bottom:10px" v-for="item in shopMsg.supports" :key="item">
        <van-button
          type="primary"
          color="red"
          style="margin: 2px 4px 0 0; font-size: 14px; height: 20px"
          size="mini"
          >减</van-button
        >{{item}}
      </p>
    </div>
  </div>
</template>

<script>
import { shopseller } from "../apis/apis";
export default {
  data() {
    return {
      shopMsg:[],//店铺数据
    };
  },
  created() {
    shopseller({}).then((res) => {
        if (res.status == 200) {
        //   console.log(res.data.data);
        this.shopMsg = res.data.data
      }
    });
  },
};
</script>

<style lang="less" scoped>
.bussiness {
  .bussiness_buttom {
    padding: 20px;
    h3 {
      font-weight: normal;
      margin-bottom: 10px;
    }
  }
}
</style>